<template>
	<!-- 法律援助 -->
	<view class="page-main">
		<!-- 表单 -->
		<view class="form_view" style="border: none;margin: 0;">
			<up-form
					labelPosition="left"
					:model="model1"
					:rules="rules"
					ref="form"
			>
				<view class="padding-view">
					<up-form-item
							label="会员姓名"
							prop="userInfo.realName"
							borderBottom
							labelWidth="80px"
					>
						<up-input
								v-model="memberData.userInfo.realName"
								border="none"
								placeholder="请输入"
								readonly="true"
						></up-input>
					</up-form-item>
					<up-form-item
							label="性别"
							prop="userInfo.gender"
							borderBottom
							@click="showSex = true;"
							labelWidth="80px"
					>
						<input
						      :value="memberData.userInfo.gender === 0 ? '男' : '女'"
						      disabled
						      placeholder="请选择"
						      style="border: none;"
						    />
						<!-- <template #right>
							<up-icon
								name="arrow-right"
							></up-icon>
						</template> -->
					</up-form-item>
					<up-form-item
							label="出生日期"
							prop="userInfo.birthday"
							borderBottom
							labelWidth="80px"
					>
						<up-input
								v-model="memberData.userInfo.birthday"
								border="none"
								placeholder="请输入"
								readonly="true"
						></up-input>
					</up-form-item>
					
					<up-form-item
							label="手机号"
							prop="userInfo.mobile"
							borderBottom
							labelWidth="80px"
					>
						<up-input
								v-model="memberData.userInfo.mobile"
								border="none"
								placeholder="请输入"
								readonly="true"
						></up-input>
					</up-form-item>
					<up-form-item
							label="会员所在单位全称"
							prop="userInfo.orgName"
							borderBottom
							labelWidth="140px"
					>
						<up-input
								v-model="memberData.userInfo.orgName"
								border="none"
								placeholder="请输入"
								readonly="true"
						></up-input>
					</up-form-item>
					
					<up-form-item
							label="信件内容"
							prop="userInfo.content"
							borderBottom
							labelWidth="80px"
							labelPosition="top"
					>
						<up-textarea v-model="model1.userInfo.content" placeholder="请输入" count :maxlength="300"></up-textarea>
					</up-form-item>
				</view>
			
			</up-form>
			<up-action-sheet
					:show="showSex"
					:actions="actions"
					title="请选择咨询类型"
					@close="showSex = false"
					@select="sexSelect"
			>
			</up-action-sheet>
			
		</view>
		<view class="submit-btn">
			<button size="mini" class="btn" @click="submit">
				提交
			</button>
		</view>
		
	</view>
</template>

<script>
	import {memberUserApi} from '@/api/member/member-uer-api.js'
	import {mailboxApi} from '@/api/mailbox/mailboxApi.js';
	export default {
		data() {
			return {
				showSex: false,
				  memberData: {
				  	userInfo: { 
				  		realName: '',
				  		gender: 0,  
				  		birthday: '',
				  		idNumber: '',
				  		mobile: '',
				  		orgName: '',
				  
				  	},  
				  },
				model1: {  
				    userInfo: {  
					  content: ''
				    },  
				},  
				actions: [  
				    { name: '合同纠纷',value:1 },  
				    { name: '侵权责任',value:2 },
					{ name: '婚姻家庭',value:3 },
				    { name: '继承纠纷',value:4 },
					{ name: '物权纠纷',value:5 },
				],  
				rules: {  
				    'userInfo.content': {  
				      type: 'string',  
				      required: true,  
				      message: '请输入信件内容',  
				      trigger: ['blur', 'change'],  
				    },  
				}
			}
		},
		onLoad() {
			this.getLoginMember();
		},
		onReady() {
			//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
			this.$refs.form.setRules(this.rules)
		},
		methods: {
			async submit() {
				try {
				    await this.$refs.form.validate();
				    // 表单验证通过后，提交数据
				    mailboxApi.submit(this.model1.userInfo).then(res=>{
						uni.switchTab({
							url:'/pages/staff-centre/index'
						})
					})
				    
				  } catch (error) {
				    console.error('提交失败:', error);
				  }
			},
			goBack() {
				uni.navigateBack({
					delta: 1
				});
			},
			sexSelect(e) {  
			  this.model1.userInfo.consultationTypeStr = e.name;  
			  this.model1.userInfo.consultationType = e.value;
			},
			async getLoginMember(){
				const result = await memberUserApi.getLoginMemberInfo();
				Object.assign(this.memberData.userInfo, result.data);
			},
		}
	}
</script>
